<form id="add-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">


    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('User_id')} ID:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-user_id" data-rule="required" class="form-control"  name="row[user_id]" type="number" value="">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('包裹图片')}:</label>
        <div class="col-xs-12 col-sm-8">
            <div class="input-group">
                <input id="c-image" class="form-control" size="50" name="row[image]" type="text" value="">
                <div class="input-group-addon no-border no-padding">
                    <span><button type="button" id="faupload-image" class="btn btn-danger faupload" data-input-id="c-image" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp" data-multiple="false" data-preview-id="p-image"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                    <span><button type="button" id="fachoose-image" class="btn btn-primary fachoose" data-input-id="c-image" data-mimetype="image/*" data-multiple="false"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                </div>
                <span class="msg-box n-right" for="c-image"></span>
            </div>
            <ul class="row list-inline faupload-preview" id="p-image"></ul>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('包裹重量')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-delivery_weight"   class="form-control"  name="row[delivery_weight]" type="number" value="">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Delivery_price')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-delivery_price"   class="form-control"  name="row[delivery_price]" type="number" value="">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('箱数')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-box_num"   class="form-control"  name="row[box_num]" type="number" value="">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Remark')}:</label>
        <div class="col-xs-12 col-sm-8">
            <textarea  id="c-remark"   class="form-control"  name="row[remark]" ></textarea>
        </div>
    </div>

    <div class="form-group" style="height: 30px;background: #0a6aa1;color:white;text-align: center;line-height: 30px;margin: 10px;">商品</div>
    <div class="form-group"  id="goods-add" style="border-radius:5px;height: 30px;width:70px;background: #a3bce4;color:white;text-align: center;line-height: 30px;margin: 10px;">追加商品</div>

    <div class="fieldlist" data-template="eventtpl" data-name="row[event]" id="goods-div" style="border-top: #0a6aa1 solid 1px;border-bottom: #0a6aa1 solid 1px;">
        <div style="margin-top: 5px;padding-top: 5px;" class="goods_info" >
            <div class="form-group">
                <label class="control-label col-xs-12 col-sm-2">{:__('商品名称')}:</label>
                <div class="col-xs-12 col-sm-8">
                    <input id="c-name0"  data-rule="required"  class="form-control" name="goods[name][]" type="text" value="">
                </div>
            </div>
            <!--
            <div class="form-group">
                <label class="control-label col-xs-12 col-sm-2">{:__('分类')}:</label>
                <div class="col-xs-12 col-sm-8">
                    <input id="c-category_id" min="0" data-rule="required" data-source="category/index"   class="form-control selectpage" name="row[category_id]" type="text" value="">
                </div>
            </div>
            -->
            <div class="form-group">
                <label class="control-label col-xs-12 col-sm-2">{:__('商品数量')}:</label>
                <div class="col-xs-12 col-sm-8">
                    <input id="c-number0"  data-rule="required" step="1" class="form-control" name="goods[number][]" type="number" value="">
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-xs-12 col-sm-2">{:__('商品价格')}:</label>
                <div class="col-xs-12 col-sm-8">
                    <input id="c-price0"  data-rule="required" step="0.01" class="form-control" name="goods[price][]" type="number" value="">
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-xs-12 col-sm-2">{:__('重量')}:</label>
                <div class="col-xs-12 col-sm-8">
                    <input id="c-weight0"   data-rule="required" step="0.01"  class="form-control" name="goods[weight][]" type="number" value="">
                </div>
            </div>
        </div>
    </div>

    <div class="form-group" style="height: 30px;background: #0a6aa1;color:white;text-align: center;line-height: 30px;margin: 10px;">收货地址</div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('收货人名称')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input   data-rule="required"  class="form-control" name="address[name]" type="text" value="">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('收货人手机号')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input   data-rule="required"  class="form-control" name="address[mobile]" type="text" value="">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('省/市/区')}:</label>
        <div class="col-xs-12 col-sm-8">
            <div class='control-relative'><input id="c-city" class="form-control" data-toggle="city-picker" name="address[city]" type="text" value=""></div>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('收货人具体地址')}:</label>
        <div class="col-xs-12 col-sm-8">
            <textarea   data-rule="required"  class="form-control" name="address[address]"></textarea>
        </div>
    </div>


    <div class="form-group layer-footer">
        <label class="control-label col-xs-12 col-sm-2"></label>
        <div class="col-xs-12 col-sm-8">
            <button type="submit" class="btn btn-success btn-embossed disabled">{:__('OK')}</button>
            <button type="reset" class="btn btn-default btn-embossed">{:__('Reset')}</button>
        </div>
    </div>
</form>



<script src="/assets/libs/jquery/dist/jquery.js"></script>
<script>
    var goods_html = `
    <div style="border-top: #a3bce4 1px solid;margin-top: 5px;padding-top: 10px;" class="goods_info">
            <div class="form-group">
                <label class="control-label col-xs-12 col-sm-2">{:__('商品名称')}:</label>
                <div class="col-xs-12 col-sm-8">
                    <input id="c-name##"   data-rule="required"  class="form-control" name="goods[name][]" type="text" value="">
                </div>
            </div>

            <div class="form-group">
                <label class="control-label col-xs-12 col-sm-2">{:__('商品数量')}:</label>
                <div class="col-xs-12 col-sm-8">
                    <input  id="c-number##" data-rule="required" step="1" class="form-control" name="goods[number][]" type="number" value="">
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-xs-12 col-sm-2">{:__('商品价格')}:</label>
                <div class="col-xs-12 col-sm-8">
                    <input id="c-price##"  data-rule="required" step="0.01" class="form-control" name="goods[price][]" type="number" value="">
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-xs-12 col-sm-2">{:__('重量')}:</label>
                <div class="col-xs-12 col-sm-8">
                    <input  id="c-weight##" data-rule="required" step="0.01"  class="form-control" name="goods[weight][]" type="number" value="">
                </div>
            </div>
            <div class="form-group"  onclick="del(this)" style="border-radius:5px;height: 30px;width:70px;background: #a2a2a2;color:white;text-align: center;line-height: 30px;margin: 10px;">删除</div>
        </div>
    `;
   $("#goods-add").bind("click",function () {
       var num = $(".goods_info").length
       console.log(num);
       var new_goods_html = goods_html.replace(/##/g,num);
        $("#goods-div").append(new_goods_html)
   });



   function del(ob) {
        $(ob).parent().remove();
   }

</script>
